<template>

    <el-form :model="TagForm" label-width="90px" size="medium">
        <h2 class="Regi-title">编辑用户</h2>
        <!-- 用户名 -->
        <el-form-item label="标签ID：">
            <el-input v-model="TagForm.tag_id" placeholder="请输入用户名" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="货物类型：">
            <el-select v-model="TagForm.fix_id" placeholder="选择用户">
                <a href="/add_fix" class="Add_user">
                    <el-option value="创建货物类型" class="A-option"></el-option>
                </a>
                <el-option v-for="fix in FixList" :key="fix.id" :value="fix.name">
                </el-option>
            </el-select>
        </el-form-item>
        <el-form-item label="分配用户：">
            <el-select v-model="TagForm.fen_uid" placeholder="选择用户">
                <a href="/add_user" class="Add_user">
                    <el-option value="创建新用户" class="A-option"></el-option>
                </a>
                <el-option v-for="user in UserList" :key="user.id" :value="user.username">
                </el-option>
            </el-select>
        </el-form-item>
        <el-form-item class="El-Button-Submit">
            <el-button type="primary" @click="SubmitUpdate" style="width:150px;">提交</el-button>
        </el-form-item>
    </el-form>

</template>

<script>
import { update_tag_post } from '../axios_api/api'
export default {
    props: ['TagForm', 'UserList', 'FixList'],
    data() {
        return {
        }
    },
    mounted() {
    },
    methods: {
        // 提交修改
        SubmitUpdate() {
					console.log(this.TagForm)
            // 将用户名转换成用户id，以便于后端直接存储数据库
            for (let i = 0; i < this.UserList.length; i++) {
                if (this.TagForm.fen_uid === this.UserList[i].username) {
                    this.TagForm.fen_uid = this.UserList[i].id
                }
            }
            // 将货物类型名转换成货物类型id，以便于后端直接存储数据库
            for (let i = 0; i < this.FixList.length; i++) {
                if (this.TagForm.fix_id === this.FixList[i].name) {
                    this.TagForm.fix_id = this.FixList[i].id
                }
            }
						let data = { UpdateTag: this.TagForm}
						console.log(data)
            update_tag_post(data).then(resp => {
                if (resp.code === 200) {
                    this.$message.success(resp.message)
                    this.$router.go(0)
                } else {
                    this.$message.error(resp.message)
                }
            })
        },
    },
}
</script>

<style lang="scss" scoped>
.Add_user {
    text-decoration: none;
    :link {
        color: red;
        text-decoration: none;
    }
    :visited {
        color: red;
        text-decoration: none;
    }
    :hover {
        color: red;
        text-decoration: none;
    }
    :active {
        color: red;
        text-decoration: none;
    }
    .A-option {
        color: red;
        font-size: 12px;
    }
}
.el-select {
    width: 260px;
}
.el-input {
    width: 260px;
}
.El-Button-Submit {
    margin-left: 20px;
}
</style>